// LESS

// GLobals

@nav-ratio: 20%;
@marge: 8px;

// Mixins

.border-radius(@radius: 15px)
{
  -webkit-border-radius: @radius;
  -moz-border-radius: @radius;
  border-radius: @radius;
}

.border-solid()
{
  border: 1px solid #ccc;
}

.background-gradient(@color1, @color2, @direction: bottom right)
{
  background: -webkit-linear-gradient(@direction, @color1, @color2); /* For Safari */
  background: -o-linear-gradient(@direction, @color1, @color2); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(@direction, @color1, @color2); /* For Firefox 3.6 to 15 */
  background: linear-gradient(to @direction, @color1 , @color2); /* Standard syntax */
}

.set-font()
{
  font-family: "Lucida Grande","DejaVu Sans","Bitstream Vera Sans",Verdana,Arial,sans-serif;
  font-size: 100%;
  color: #333;
}

.title-style()
{
  font-weight: bold;
  font-variant: small-caps;
  text-align: center;
  padding: 1.5%;
  color: #555555;
}

// Stylesheet

body
{
  .set-font();
  margin: 0;
  padding: 0;
  background: #fff;
}

header
{
  //width: 100%;
  padding: 0.5%;
  h1
  {
    .title-style();
    .background-gradient(#3399FF, #D6EBFF);
    .border-radius();

    font-size: 300%;
  }
}

nav
{
  float: left;
  padding-left: 0.5%;
  padding-right: 0.5%;
  width: @nav-ratio - 1%;
}

section
{
  margin-left: @nav-ratio + 1%;

  #section-title
  {
    .border-radius();
    .title-style();
    .background-gradient(#EEEEEE, #FFFFFF);
    .border-solid();

    margin-left: -1%;
    margin-right: 1%;
    font-size: 200%;
  }
}

/* LINKS */

a
{
  &:link, &:visited
  {
    color: #5b80b2;
    text-decoration: none;
  }

  &:hover
  {
    color: #036;
  }

  img
  {
    border: none;
  }

  &.section:link, &.section:visited
  {
    color: white;
    text-decoration: none;
  }
}

/* CONTENT */

#content-main
{
  padding-right: 2%;
  padding-top: 2%;
}

#extension-description
{
  text-align:justify;
}

/* GLOBALS */

p, ol, ul, dl
{
  margin: .2em 0 .8em 0;
}

p
{
  padding: 0;
  line-height: 140%;
}

h1,h2,h3,h4,h5
{
  font-weight: bold;
  font-variant: small-caps;
  -webkit-margin-before: 0;
  -webkit-margin-after: 0;
}

h1
{
  font-size: 200%;
  color: #666;
}

h2
{
  font-size: 175%;
}

h2.subhead
{
  font-weight: normal;
}

h3
{
  font-size: 150%;
  color: #666;
  font-weight: bold;
}

h4
{
  font-size: 125%;
  padding-bottom: 3px;
}

h5
{
  font-size: 110%;
  color: #666;
  text-transform: uppercase;
  letter-spacing: 1px;
}

ul li
{
  list-style-type: square;
  padding: 1px 0;
}

ul.plainlist
{
  margin-left: 0 !important;
}

ul.plainlist li
{
  list-style-type: none;
}

ul.errorlist li
{
  list-style-type: none;
  color: red;
}

li ul
{
  margin-bottom: 0;
}

li, dt, dd
{
  font-size: 100%;
  line-height: 14px;
}

dt
{
  font-weight: bold;
  margin-top: 4px;
}

dd
{
  margin-left: 0;
}

form
{
  margin: 0;
  padding: 0;

  p
  {
    label
    {
      display:      block;
      font-variant: small-caps;
      font-weight:  bold;
      font-size:    120%;
    }
    text, input, textarea
    {
      margin:  @marge @marge @marge @marge;
      display: block;
    }
  }

  .button-holder
  {
    margin:  @marge @marge @marge @marge;
    display: block;
    float:   center;
    text-align: center;
    input
    {
      font-size: 150%;
    }
  }
}

fieldset
{
  margin: 0;
  padding: 0;
}

/* TABLE */

table
{
  border-collapse: collapse;
  border-color: #ccc;
  width : 100%;
}

td
{
  font-size: 100%;
  line-height: 20px;
  border-bottom: 1px solid #eee;
  vertical-align: top;
  padding: 5px;
  font-family: "Lucida Grande", Verdana, Arial, sans-serif;
}

tr.row-label
{
  td
  {
    font-weight: bold;
    font-variant: small-caps;
    font-size: 130%;
    padding-top: 0px;
    margin-top: 0px;
    border-bottom: 3px solid #eee;
    color: #666;
    padding-bottom: 10px;
  }
}

/* FORM DEFAULTS */

input, textarea, select, .form-row p
{
  margin: 2px 0;
  padding: 2px 3px;
  vertical-align: middle;
  font-family: "Lucida Grande", Verdana, Arial, sans-serif;
  font-weight: normal;
  font-size: 100%;
}

textarea
{
  vertical-align: top !important;
}

input[type=text], input[type=password], input[type=email], input[type=url], input[type=number],
textarea, select, .vTextField
{
  .border-solid();
}

/* FORM BUTTONS */

.button, input[type=submit], input[type=button], .submit-row input
{
  background: white url(../img/nav-bg.gif) bottom repeat-x;
  padding: 3px 5px;
  color: black;
  border: 1px solid #bbb;
  border-color: #ddd #aaa #aaa #ddd;
}

.button:active, input[type=submit]:active, input[type=button]:active
{
  background-image: url(../img/nav-bg-reverse.gif);
  background-position: top;
}

.button[disabled], input[type=submit][disabled], input[type=button][disabled]
{
  background-image: url(../img/nav-bg.gif);
  background-position: bottom;
  opacity: 0.4;
}

.button.default, input[type=submit].default, .submit-row input.default
{
  border: 2px solid #5b80b2;
  background: #7CA0C7 url(../img/default-bg.gif) bottom repeat-x;
  font-weight: bold;
  color: white;
  float: right;
}

.button.default:active, input[type=submit].default:active
{
  background-image: url(../img/default-bg-reverse.gif);
  background-position: top;
}

.button[disabled].default, input[type=submit][disabled].default, input[type=button][disabled].default
{
  background-image: url(../img/default-bg.gif);
  background-position: bottom;
  opacity: 0.4;
}

/* MODULES */

.module
{
  .border-solid();
  .background-gradient(#EEEEEE, #FFFFFF);
  .border-radius(8%);

  padding: 2%;

  p, ul, h3, h4, dl, pre
  {
    padding-left: 10px;
    padding-right: 10px;
  }

  h3
  {
    font-weight: bold;
    font-variant: small-caps;
    text-align: left;
    margin-top: .6em;
    margin-bottom: .6em;
    font-size: 120%;
  }

  h2
  {
    .border-radius();
    .title-style();
    .background-gradient(#3399FF, #D6EBFF);
    .border-solid();

    font-size: 130%;
  }

  table
  {
    border-collapse: collapse;
  }

  a
  {
    &:link, &:visited
    {
      color: #999;
      text-decoration: none;
    }
  }
}

/* 3D OBJECTS */

viewer
{
  .background-gradient(#aaa, #666);
  .border-radius();
  display:    block;
  float:      center;
  text-align: center;
  border:     1px solid #666;
  margin:     @marge @marge @marge @marge;
}

// vim:ft=css
